<template>
  <el-carousel trigger="click" height="150px">

    <el-carousel-item v-for="item in introduce" :key="item._id">
      <img :src="item.logo" alt="加载失败" :title="item.title" @click="jump(item._id)">
    </el-carousel-item>
  </el-carousel>
</template>

<script>
  import {mapState} from 'vuex'

  export default {
    name: "Carousel",
    methods: {
      getIntroduce() {
        this.$store.dispatch('getIntroduce')
      },
      jump(id) {
        this.$store.dispatch('getSingleIntroduce', id)
        this.$router.push('/introduce')
      }
    },
    created() {
      this.getIntroduce()
    },
    computed: {
      ...mapState(['introduce'])
    }
  }
</script>

<style scoped lang="less">
  .el-carousel {
    width: 600px;
    display: inline-block;

    img {
      width: 100%;
      transform: translateY(-25%);
    }
  }
</style>
